;(function(window, $) {

    $.fn.myDropmenu = {
        init: function(container, options, name) {
            this.removeEvents()
            createDoms(container, options, name)
            this.myEvents()
        },
        // 获取当前值
        getValue: function(name) {
            var myDropmenuWrapDom = $('div[name="'+name+'"]')
            var value = myDropmenuWrapDom.find('.my-dropmenu-seleted-show-text').attr('data-value')
            return value;
        },
        clear: function(name) {
            var myDropmenuWrapDom = $('div[name="'+name+'"]')
            var myDropmenuSeletedShowTextDom = myDropmenuWrapDom.find('.my-dropmenu-seleted-show-text')
            myDropmenuWrapDom.removeClass('my-dropmenu-wrap-expand')
            myDropmenuSeletedShowTextDom.text('').removeAttr('data-value')
        },
        myEvents: function() {
            // 监听 .my-dropmenu-seleted-show 的点击事件
            $(document).on('click', '.my-dropmenu-wrap .my-dropmenu-seleted-show', myDropmenuSeletedShowCallback)
            $(document).on('click', '.my-dropmenu-wrap .my-dropmenu-li', myDropmenuLiCallback)
            $(window).on('click', windowClickCallback)
        },
        removeEvents: function() {
            $(document).off('click', '.my-dropmenu-wrap .my-dropmenu-seleted-show', myDropmenuSeletedShowCallback)
            $(document).off('click', '.my-dropmenu-wrap .my-dropmenu-li', myDropmenuLiCallback)
            $(window).off('click', windowClickCallback)
        }
    }

    // 创建 dom 
    function createDoms(container, options, name) {
        var htmls1 = [
            '<div class="my-dropmenu-wrap" name="'+name+'">',
            '<div class="my-dropmenu-seleted-show">',
            '<span class="my-dropmenu-seleted-show-text">请选择</span>',
            '<i class="iconfont icon-xiala"></i>',
            '</div>',
            '<div class="my-dropmenu">',
            '<ul class="my-dropmenu-ul">',
        ]
        var htmls3 = [
            '</ul>',
            '</div>',
            '</div>'
        ]
        options = options || []
        var htmls2 = options.map(function(option) {
            var optionStr = '';
            optionStr += '<li class="my-dropmenu-li" data-value="'+option.type+'">'
            optionStr += '<div class="my-dropmenu-li-text">'+option.explain+'</div>'
            optionStr += '</li>'
            return optionStr
        })
        var htmls = $.merge(htmls1, htmls2, htmls3)
        // if(!container || container.nodeType !== 1) {
        //     return console.error("请传入包裹dom")
        // }
        $(container).html(htmls.join(''))
    }

    // 点击下拉框
    function myDropmenuSeletedShowCallback(e) {
        console.log('点击下拉框');
        e.stopPropagation()
        var $this = $(this)
        var parent = $this.closest('.my-dropmenu-wrap')
        var dropmenu = parent.find('.my-dropmenu')
        var isExpand = parent.hasClass("my-dropmenu-wrap-expand")
        if(isExpand) {
            parent.removeClass('my-dropmenu-wrap-expand')
        } else {
            parent.addClass('my-dropmenu-wrap-expand')
        }
    }

    // 点击下拉菜单的 li
    function myDropmenuLiCallback(e) {
        e.stopPropagation()
        console.log('点击下拉菜单的 li');
        var $this = $(this)
        var text = $this.find('.my-dropmenu-li-text').text()
        var value = $this.attr('data-value')
        var parent = $this.closest('.my-dropmenu-wrap')
        var dropmenu = parent.find('.my-dropmenu')
        var isExpand = parent.hasClass("my-dropmenu-wrap-expand")
        var myDropmenuSeletedShowTextElement = parent.find('.my-dropmenu-seleted-show-text')
        myDropmenuSeletedShowTextElement.attr('data-value', value).text(text)
        parent.removeClass('my-dropmenu-wrap-expand')
        // asr_type = value
        console.log('----------value-----', $.fn.myDropmenu.getValue("analysisiLangs"))
    }

    // 点击 window 
    function windowClickCallback(e) {
        console.log('window click')
        e.stopPropagation()
        $('.my-dropmenu-wrap').removeClass('my-dropmenu-wrap-expand')
    }
})(window, jQuery)